<template lang="">
    <div>
        <table>
            <tr>
                <td>名称</td>
                <td>操作</td>
            </tr>
            <tr v-for='i in list'>
                    <td>{{i.name}}</td>
                    <td>
                        <!-- 跳转传值 传name、id -->
                        <router-link :to="{name:'update',query:{'id':i.id}}">修改</router-link>
                        <button @click="del(i.id)">删除</button>
                    </td>
                </tr>
                <tr>
                    <td>
                            <van-pagination
                            v-model="currentPage"
                            :total-items='total'
                            :items-per-page='3'
                            @change='getlist'
                            force-ellipses
                          />
                    </td>
                </tr>
        </table>
    </div>
</template>
<script>
export default {
    data(){
        return{
            list:[],
            currentPage:1,
            total:0,
        }
    },
    methods: {
        //v形参，传递当前页数
        getlist(v){
            this.currentPage = v
            this.$axios.get('cateM?page='+v).then(res=>{
                this.list = res.data.list
                this.total = res.data.total
            })
        },
        del(id){
             this.$axios.delete('cateM?id='+id).then(res=>{
                this.$toast.fail('删除成功')
                this.getlist(1)
            })
        },
    },
    mounted() {
        this.getlist(1)
    },
}
</script>
<style lang="">
    
</style>